import React, { Component } from "react";
// 组件
import MainLayout from "../../../component/mainLayout/mainLayout";
import BankCard from "../../../component/xhbBankCard/xhbBankCard";
import { Toast, Modal } from "antd-mobile";

import { InterfaceG, channelCode } from "../../../config/Config";
import yhTools from "../../../tools/yh";

import logoImg from "../../../images/icon-hua-tong-bank-logo.png";
import "./electronicAccountList.scss";

/**
 * 描述： 目前已经废弃(20210324)
 * 作者：zenghq
 * 日期：2020-06-01
 */
const alert = Modal.alert;
class electronicAccountList extends Component {
	constructor(props) {
		super(props);
		this.state = {
			eleAcctInfoList: []
		};
	}
	/*******************生命周期 start************************/
	componentDidMount = () => {
		this.initData();
	};
	componentWillUnmount = () => {};
	/*******************生命周期 end************************/

	/*******************业务方法 start************************/
	initData() {
		let objs = {
			url: InterfaceG.appGetEleAcctInfoList,
			params: {
				version: "1.0",
				channelCode
			},
			_alertShow: false
		};
		Toast.loading("加载中...", 10);
		yhTools.request(objs).then(async res => {
			Toast.hide();
			if (res.code === "0") {
				this.setState({
					eleAcctInfoList: res.data
				});
			} else {
				Toast.info(res.message, 2);
			}
		});
	}
	/*******************业务方法 end************************/

	/*******************点击事件 start************************/
	/**银行卡点击 */
	handledBank(item) {
		if (item.acctStatus == "0") {
			alert("", "该账户暂时无法操作，请联系银行客服400-8219-666", [
				{ text: "查看详情", onPress: () => console.log("cancel") },
				{ text: "确定", onPress: () => console.log("ok") }
			]);
		} else {
			this.props.history.push({
				pathname: "/bankDetailPage",
				state: { statePrame: { backPath: "/xhbBalanceNoSign" } }
			});
		}
	}
	/*******************点击事件 end************************/

	/**渲染 */
	render() {
		const { eleAcctInfoList = [] } = this.state;
		const _pageParams = {
			header: {
				title: "我的电子账户"
			},
			history: this.props.history,
			cacheLifecycles: this.props.cacheLifecycles
		};
		return (
			<MainLayout pageParams={_pageParams}>
				<div className="electronic_account_list-box">
					{eleAcctInfoList.map(item => (
						<div className="card-box" key={item.electronicCardNo}>
							<BankCard
								onClick={this.handledBank.bind(this, item)}
								money={item.amount}
								disabled={item.acctStatus == "0"}
								src={logoImg}
								electronicCardNo={`**** **** **** ${item.electronicCardNo.substring(
									item.electronicCardNo.length - 4
								)}`}
							></BankCard>
						</div>
					))}
				</div>
			</MainLayout>
		);
	}
}

export default electronicAccountList;
